<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title>意见反馈</title>
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="Cache-Control" content="no-cache, must-revalidate">
		<meta http-equiv="expires" content="0">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
		<!--标准mui.css-->
		<link rel="stylesheet" href="../css/mui.min.css">
		<link rel="stylesheet" href="../css/common.css" />
	</head>
	<style>
		body{
			background-color: #f6f6f6;
		}
		.mui-content {
			background-color: #f6f6f6;
		}
		.textareaText {
			width: 100%;
			height: 186px;
			color: #4C4C4C;
		    font-size: 12px;
	        margin-bottom: 0;
			background-color: #FFFFFF;
			border-width: 1px 0px;
    			border-radius: 0px;
    			display: block;
		}
		input[type=text] {
			height: 45px;
			width: 100%; 
			color:#4C4C4C;
			font-size: 13px;
			background-color: #FFFFFF;
		    border-width: 1px 0px;
    			border-radius: 0px;
		}
		::-webkit-input-placeholder{
		    color: #999999;
		    font-size: 13px;
		    opacity: 0.6;
		 }
		 .phone-div {
		 	margin-left: 20px;
		 	font-family: 'PingFangSC-Regular';
			font-size: 14px;
			color: #4C4C4C;
			line-height: 45px;
		 }
		 .center {
		 	text-align: -webkit-center;
		 }
		 .tips-container {
		 	width: 100px;
		 	height: 100px;
	 	    margin-top: 50%;
		 	background: #FFFFFF;
			border-radius: 4px;
			text-align: center;
		 }
		 .tips-icon {
		 	width: 36px;
		 	height: 36px;
		 	margin-top: 15px;
		 }
		 .tips-div {
		 	font-family: 'PingFangSC-Regular';
			font-size: 14px;
			color: #333333;
			line-height: 30px;
		 }
	</style>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">意见反馈</h1>
		</header>
		<div class="mui-content">
			<div class="phone-div">意见反馈</div>
			<textarea class="textareaText" wrap="soft" id="content" placeholder="请输入十个字以上的问题描述以便我们更好的为您提供帮助！"></textarea>
			<div class="phone-div">联系电话</div>
			<input required="" type="text" id="phone" placeholder="请留下您的联系方式方便沟通！" />
			<div class="transaction-container"><button type="button">保存</button></div>
			<div id="successBox" class="modal-backdrop center">
				<div class="tips-container">
					<img class="tips-icon" src="../img/mine/choose_icon.png" />
					<div class="tips-div">提交成功</div>
				</div>
			</div>
		</div>
	<body>
	<script type="text/javascript" src="../js/thirdparty/jquery-3.3.1.js" ></script>
	<script type="text/javascript" src="../js/thirdparty/mui.min.js" ></script>
	<script type="text/javascript" src="../js/thirdparty/spin.min.js" ></script>
	<script type="text/javascript" src="../js/utils/boot.js" ></script>
	<script type="text/javascript">
		var customerId = base.getParameter("customerId");
		$(".transaction-container").on("tap", "button", function() {
			submitFeekBack();
		})
		function submitFeekBack() {
			if($("#content").val() == null || $("#content").val() == "") {
				mui.toast("内容不能为空");
	        		return;
	        }
			if($("#phone").val() == null || $("#phone").val() == "") {
				mui.toast("微信或者手机号不能为空");
	        		return;
	        }
			var url = base.url.addFeedbackInfo;
			var data = {
				customerId: customerId,
				phone: $("#phone").val(),
				feedbackContent: $("#content").val(),
			};
			base.postData(url,data,addFeedbackSuccess);
		}
		function addFeedbackSuccess (data) {
			if (data.success) {
				$("#successBox").show();
				setTimeout(function(){
					$("#successBox").hide();
					mui.back();
				},1000);
			} else {
				mui.toast('提交失败');
			}
		}
		var openid = base.getParameter("openid");
	</script>
</html>
